<template>
    <div class="table">
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item><i class="icon iconfont icon-jifen"></i> 查看线路详情</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="container">
            <el-form ref="form" :model="data" label-width="150px" @submit.native.prevent>
                <el-form-item label="封面图：">
                    <template>
                        <el-carousel indicator-position="outside">
                            <el-carousel-item v-for="item in data.img_banner" :key="item">
                            <img :src="item"/>
                            </el-carousel-item>
                        </el-carousel>
                    </template>
                </el-form-item>
                <el-form-item label="新闻标题：">
                    <p v-html="data.title"></p>
                </el-form-item>
                <el-form-item label="原价：">
                    <p v-text="data.normal_price"></p>
                </el-form-item>
                <el-form-item label="优惠价：">
                    <p v-text="data.member_price"></p>
                </el-form-item>
                <el-form-item label="详情描述：">
                    <p v-html="data.detail"></p>
                </el-form-item>
            </el-form>
            
        </div>
        
    </div>
</template>
<script>
export default {
    name:'newsAdd',
    data (){
        return{
            data:{}
        }
    },
    mounted (){
        // console.log(this.$route.params.id);
        // console.log(this.$route.path);
        this.getNews();
    },
    methods:{
        getNews (){
            if(this.$route.params.id && this.$route.params.id ){
                this.$axios.get('/manage/tour-line/find', {
                    params: {
                    id: this.$route.params.id

                    }
                })
                .then(response=>{
                    //console.log(response);
                    if(response.data.code==200){
                        //获取数据
                        response.data.data.img_banner = JSON.parse(response.data.data.img_banner);
                        this.data = response.data.data;
                        //console.log(this.data);
                    }else{
                        this.$notify.error({
                            title: '查询失败',
                            duration:2000,
                            message: '失败原因：'+response.data.msg
                        });
                    }
                })
                .catch(function (response) {
                    console.log(response);
                });
            }else{
                this.$message.error('获取新闻ID失败');
            }
        }
    }
}
</script>
<style lang="stylus" scoped>
    .el-carousel__item h3 {
        color: #475669;
        font-size: 18px;
        opacity: 0.75;
        line-height: 300px;
        margin: 0;
    }
    
    .el-carousel__item:nth-child(2n) {
        background-color: #99a9bf;
    }
    
    .el-carousel__item:nth-child(2n+1) {
        background-color: #d3dce6;
    }
</style>


